<!--{foreach item=item from=$singlecate}-->
<!--{if $item.type eq 1}-->
    <!--{if $item.cssid eq 1}-->
    <!-- START SERVICES -->
    <section class="section bg-services" id="<!--{$item.acode}-->" style="background: url(<!--{$item.imgurl}-->);">
        <div class="bg-overlay bg-black opacity-4"></div>
        <div class="container h-100">
            <div class="row h-100">
                <div class="offset-md-6 col-md-6 my-auto">
                    <div id="services_slider" class="owl-carousel owl-theme">
                        <!--{foreach item=sinfo key=k from=$item.single}-->
                        <div class="services-item item text-center text-md-right">
                            <div class="services-icon per-slide">
                            	<!--{if empty($sinfo.imgurl)}-->
                            	<i class="lni-cup wow fadeInUp"></i>
                        	    <!--{else}-->
                                <img src="<!--{$sinfo.imgurl}-->" alt="work-img">
                                <!--{/if}-->
                            </div>
                            <h1 class="mb-4 text-white per-slide wow fadeInRight font-weight-light shining-text"><!--{$sinfo.title}--></h1>
                            <!--line-->
                            <div class="testimonial-line wow fadeInRight"></div>
                            <p data-aos="fade-left" class="mb-5 per-slide text-white wow fadeInLeft" style="text-align: left;"><!--{$sinfo.content}--></p>
                        </div>
				        <!--{/foreach}-->
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- END SERVICES -->
	<!--{else if $item.cssid eq 2}-->
	<!-- START TEAM -->
    <section class="section bg-team" id="<!--{$item.acode}-->"  style="background: url(<!--{$item.imgurl}-->);">
        <div class="bg-overlay bg-black opacity-4"></div>
        <div class="container h-100">
            <div class="row h-100">
                <div class="col-md-6 my-auto">
                    <div id="testimonial-quote" class="owl-carousel">
                    	<!--{foreach item=sinfo key=k from=$item.single}-->
                        <div class="item">
                            <div class="testimonial-quote whitecolor">
                                <div class="team-img mb-4"><img src="<!--{$sinfo.imgurl}-->" alt="img"></div>
                                <h1 class="font-weight-light mb-3 alt-font"><!--{$sinfo.title}--></h1>
                                <div class="mb-3 testimonial-line wow fadeInleft"></div>
                                <div class="mb-1 mb-md-5"> <span><!--{$sinfo.introduction}--></span></div>
                                <div class="team-description mb-1 mb-md-5"><p class="m-0"><!--{$sinfo.content}--></p></div>
                            </div>
                        </div>
                        <!--{/foreach}--> 
                    </div>
                    <!-- Owl Dots -->
                    <div id="owl-thumbs" class="owl-dots">
                	    <!--{foreach item=sinfo key=k from=$item.single}-->
                        <button class="owl-dot <!--{if $k==0 }-->active<!--{/if}--> link"><img src="<!--{$sinfo.imgurl}-->" alt="img"></button>
                        <!--{/foreach}--> 
                    </div>
                    <div class="team-item d-none"></div>
                </div>
            </div>
        </div>
    </section>
    <!-- END TEAM -->
    <!--{else if $item.cssid eq 3}-->
    <!-- START BARS -->
    <section class="section bg-skills" id="<!--{$item.acode}-->" style="background: url(<!--{$item.imgurl}-->);">
        <div class="bg-overlay bg-black opacity-4"></div>
        <div class="container h-100">
            <div class="row h-100">
                <div class="col-12 my-auto">
                    <div class="row">
                        <div class="col-md-6">
                            <ul class="team-progress text-left p-0 m-0">
                            	<!--{foreach item=sinfo key=k from=$item.single}-->
                                <li >
                                	<a href="<!--{$sinfo.url}-->" <!--{if $sinfo.is_target}-->target="_blank"<!--{/if}-->>
                                        <h6 class="text-white "><!--{$sinfo.title}--><span class="float-right"><b class="count text-white"></b></span></h6>
                                    </a>
                                </li>
                                <!--{/foreach}--> 
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- END BARS -->
    <!--{else if $item.cssid eq 4}-->
    <!-- START CONTACT -->
    <section id="<!--{$item.acode}-->" class="section bg-contact bg-dark position-relative" style="background: url(<!--{$item.imgurl}-->);">
    <div class="bg-overlay bg-black opacity-2"></div>
    <div class="bg-overlay bg-black2 opacity-9"></div>
    <div class="container full-screen center-block">
        <div class="contact-body">
            <div class="row">
                <div class="col-md-12">
                    <div class="main-title wow fadeIn" data-wow-delay="300ms">
                        <h2> <!--{$item.title}--> </h2>
                        <div style=" max-width: 950px; margin: 0 auto; text-align: left;">
                        <h5> <!--{$item.introduction}--> </h5>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12 col-sm-12 contact-form-center wow fadeInUp" data-wow-delay="400ms">
                    <div class="col-sm-12 p-0" id="result"></div>
                    <div class="company-contact-form">
                        <form class="contact-form-outer contact-form" method="post" action="<!--{$item.url}-->" id="contact-form-data" >
                            <div class="row">
                                <div class="col-md-6 col-sm-6 md max-width">
                                    <div class="contact-form-textfield pb-4">
                                        <input type="text" placeholder="<!--{$lang.realname}-->" class="form-control link" required="" id="name" name="userName">
                                    </div>
                                </div>
                                <div class="col-md-6 col-sm-6 max-width">
                                    <div class="contact-form-textfield pb-4">
                                        <input type="email" placeholder="<!--{$lang.email}-->" class="form-control link" required="" id="email" name="userEmail">
                                    </div>
                                </div>
                                <div class="col-md-6 col-sm-6 max-width">
                                    <div class="contact-form-textfield pb-4">
                                        <input type="tel" placeholder="<!--{$lang.phone}-->" class="form-control link" id="phone" name="userPhone">
                                    </div>
                                </div>
                                <div class="col-md-6 col-sm-6 max-width">
                                    <div class="contact-form-textfield pb-4">
                                        <input type="text" placeholder="<!--{$lang.title}-->" class="form-control link" id="subject" name="userSubject">
                                    </div>
                                </div>
                                <div class="col-lg-12">
                                    <div class="contact-form-textfield pb-4">
                                        <textarea placeholder="<!--{$lang.content}-->" class="form-control message link" id="message" name="userMessage"></textarea>
                                    </div>
                                </div>
                                <div class="col-lg-12 pt-xs-25px text-center">
                                    <button type="submit" class="btn btn-blue btn-large btn-rounded "><i class="fa fa-spinner fa-spin mr-2 d-none" aria-hidden="true"></i><b class="font-weight-normal"><!--{$lang.confirm}--></b>
                                    </button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        </div>
    </section>
    <!-- END CONTACT -->
    <!--{/if}-->
    <!--{else if $item.type eq 2}-->
    <!--{if $item.cssid eq 1}-->
    <!-- START PORTFOLIO -->
    <section class="section portfolio-sec" id="<!--{$item.acode}-->" style="background: url(<!--{$item.imgurl}-->);">
    <div id="content-scroll">
        <h2 class="d-none">市場消息</h2>
        <!-- Showcase Holder -->
        <div id="showcase-holder">
            <div id="showcase-tilt-wrap">
                <div id="showcase-tilt">
                    <div id="showcase-slider" class="swiper-container">
                        <div class="swiper-wrapper">
                            <!--{foreach item=news key=k from=$item.list}-->
                            <!-- First Slide -->
                            <div class="swiper-slide" data-title="<!--{$news.title}-->" data-subtitle="<!--{$news.introduction}-->" data-number="0<!--{$k+1}-->">
                                <div class="img-mask">
                                    <div><img src='<!--{$news.imgurl}-->'></div>
                                </div>
                                <a class="showcase-link-project" data-type="page-transition" href="javascript:;"></a>
                            </div>
                            <!-- /First Slide -->
                            <!--{/foreach}-->
                        </div>
                    </div>
                </div>
            </div>
            <div class="showcase-pagination-wrap">
                <div class="showcase-counter">
                    <span data-total="<!--{count($item.list)}-->"></span>
                </div>
                <div class="showcase-pagination"></div>
                <div class="caption-border left"></div>
                <div class="caption-border right"></div>
                <div class="arrows-wrap ">
                    <div class="prev-wrap animated-wrap"><div class="swiper-button-prev swiper-button-white parallax-element animated-element"></div></div>
                    <div class="next-wrap animated-wrap"><div class="swiper-button-next swiper-button-white parallax-element animated-element"></div></div>
                </div>
            </div>
        </div>
        <!-- Showcase Holder -->

        <!-- Swiper thumbnails -->
        <div class="swiper-thumbnails link">
        	 <!--{foreach item=news key=k from=$item.list}-->
            <button class="bullet"><img src="<!--{$news.imgurl}-->" alt="img"> </button>
            <!--{/foreach}-->
        </div>
        <!-- Swiper thumbnails -->
    </div>
    </section>
    <!-- END PORTFOLIO -->
    <!--{/if}-->
  <!--{/if}-->
<!--{/foreach}-->